import React from 'react'

import { Form, Input, Tooltip, Icon, Button,Message} from 'antd';

const FormItem = Form.Item;
import withdrawApi from '../../../api/withdraw';

import './index.less'
import '../../../style/antd-theme.less'



class WithdrawForm extends React.Component {
  state = {
    confirmDirty: false,
    sumitLoad: false,
  };

  handleSubmit = (e) => {
    e.preventDefault();
    this.props.form.validateFieldsAndScroll((err, values) => {
      if (!err) {
        this.setState({
          sumitLoad: true
        });
        this.add(values);
      }
    });
  }

  add= (values) =>{
    values.forType=2;
    values.officeId=this.props.officeId;
    values.state=0;
    withdrawApi.post('/addWithdraw', {...values}).then((data) => {
      const result= data.data;
     if(result.code == 0){
      Message.success('申请成功！');
      const { close,refeshData } = this.props;
      refeshData();
      close();
     }else{
      Message.error(result.message);
     }
     this.setState({
      sumitLoad: false
    });
  });
  }

  handleConfirmBlur = (e) => {
    const value = e.target.value;
    this.setState({ confirmDirty: this.state.confirmDirty || !!value });
  }
 


  render() {
    const { getFieldDecorator } = this.props.form;
    const { close,balance} = this.props;
    const formItemLayout = {
      labelCol: { span: 6 },
      wrapperCol: { span: 16 },
    };
    const tailFormItemLayout = {
      wrapperCol: {
        xs: {
          span: 14,
          offset: 0,
        },
        sm: {
          span: 14,
          offset: 6,
        },
      },
    };
    return (
      <Form onSubmit={this.handleSubmit}>
          <FormItem 
           {...formItemLayout}
            label="提现金额"
            hasFeedback>
          {getFieldDecorator('money', {
            rules: [{ required: true, message: '请输入提现金额!' }],
          })(
            <Input placeholder="请输入提现金额" />
          )}
        </FormItem>
        <FormItem 
           {...formItemLayout}
            label="所属银行"
            hasFeedback>
          {getFieldDecorator('bankid', {
            rules: [{ required: true, message: '请输入所属银行!' }],
          })(
            <Input  placeholder="请输入所属银行" />
          )}
        </FormItem>
        <FormItem 
           {...formItemLayout}
            label="银行卡号"
            hasFeedback>
          {getFieldDecorator('banknum', {
            rules: [{ required: true, message: '请输入银行卡号!' }],
          })(
            <Input  placeholder="请输入银行卡号" />
          )}
        </FormItem>
        <FormItem 
           {...formItemLayout}
            label="银行开户地"
            hasFeedback>
          {getFieldDecorator('bankstart', {
            rules: [{ required: true, message: '请输入银行开户地!' }],
          })(
            <Input  placeholder="请输入银行开户地" />
          )}
        </FormItem>
        <FormItem 
           {...formItemLayout}
            label="银行联系人姓名"
            hasFeedback>
          {getFieldDecorator('cardusername', {
            rules: [{ required: true, message: '请输入银行联系人姓名!' }],
          })(
            <Input  placeholder="请输入银行联系人姓名" />
          )}
        </FormItem>
        <FormItem 
           {...formItemLayout}
            label="银行联系手机"
            hasFeedback>
          {getFieldDecorator('phone', {
            rules: [{ required: true, message: '请输入银行联系手机!' }],
          })(
            <Input  placeholder="请输入银行联系手机" />
          )}
        </FormItem>
        <FormItem {...tailFormItemLayout}>
          <div>
            <Button loading={this.state.sumitLoad} type="primary" htmlType="submit" style={{marginRight:'10px'}}>确定</Button>
            <Button onClick={close}>取消</Button>
          </div>
        </FormItem>
      </Form>
    );
  }
}

const WrappedWithdrawForm = Form.create()(WithdrawForm);
export default WrappedWithdrawForm
